<template>
    <div class="mainBox">
        <!-- <div>
            <el-breadcrumb separator="/">
                <el-breadcrumb-item
                    ><a
                        href="../index.html"
                        style="font-weight: 500;font-size: 16px;"
                        >班级</a
                    ></el-breadcrumb-item
                >
                <el-breadcrumb-item>
                    <span style="font-size: 16px;">智提本</span>
                </el-breadcrumb-item>
            </el-breadcrumb>
        </div> -->
        <div class="title">智提本</div>
        <div class="nav-select">
            <div class="grade" v-for="(item, index) in navData" :key="index">
                <template v-if="item.name == '年级'">
                    <template v-if="item.list.length <= item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div
                                class="grade-selects-item"
                                v-for="(item1, index1) in item.list"
                                :key="index1"
                                @click="switchNav(index, index1)"
                                :class="
                                    item.checkName == item1.grade_name
                                        ? 'grade-selects-item1'
                                        : 'grade-selects-item'
                                "
                            >
                                {{ item1.grade_name }}
                            </div>
                        </div>
                    </template>
                    <template v-if="item.list.length > item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div class="grade-selects-cow">
                                <div style="display: flex;flex-wrap: wrap;">
                                    <div
                                        class="grade-selects-item"
                                        v-for="(item1,
                                        index1) in item.list.slice(
                                            0,
                                            item.showTypeLength
                                        )"
                                        @click="switchNav(index, index1)"
                                        :key="index1"
                                        :class="
                                            item.checkName == item1.grade_name
                                                ? 'grade-selects-item1'
                                                : 'grade-selects-item'
                                        "
                                    >
                                        {{ item1.grade_name }}
                                    </div>
                                </div>
                                <div
                                    class="grade-selects-zk"
                                    @click="isShow(index)"
                                    v-if="item.list.length > item.max"
                                >
                                    {{ item.fold ? "展开" : "收起" }}
                                    <i
                                        class="el-icon-arrow-down"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="item.fold"
                                    ></i>
                                    <i
                                        class="el-icon-arrow-up"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="!item.fold"
                                    ></i>
                                </div>
                            </div>
                        </div>
                    </template>
                </template>
                <template v-else-if="item.name == '题型'">
                    <template v-if="item.list.length <= item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div
                                class="grade-selects-item"
                                v-for="(item1, index1) in item.list"
                                :key="index1"
                                @click="switchNav1(index, index1)"
                                :class="
                                    item.checkName == item1.question_type_name
                                        ? 'grade-selects-item1'
                                        : 'grade-selects-item'
                                "
                            >
                                {{ item1.question_type_name }}
                            </div>
                        </div>
                    </template>
                    <template v-if="item.list.length > item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div class="grade-selects-cow">
                                <div style="display: flex;flex-wrap: wrap;">
                                    <div
                                        class="grade-selects-item"
                                        v-for="(item1,
                                        index1) in item.list.slice(
                                            0,
                                            item.showTypeLength
                                        )"
                                        @click="switchNav1(index, index1)"
                                        :key="index1"
                                        :class="
                                            item.checkName ==
                                            item1.question_type_name
                                                ? 'grade-selects-item1'
                                                : 'grade-selects-item'
                                        "
                                    >
                                        {{ item1.question_type_name }}
                                    </div>
                                </div>
                                <div
                                    class="grade-selects-zk"
                                    @click="isShow(index)"
                                    v-if="item.list.length > item.max"
                                >
                                    {{ item.fold ? "展开" : "收起" }}
                                    <i
                                        class="el-icon-arrow-down"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="item.fold"
                                    ></i>
                                    <i
                                        class="el-icon-arrow-up"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="!item.fold"
                                    ></i>
                                </div>
                            </div>
                        </div>
                    </template>
                </template>
                <template v-else-if="item.name == '类型'">
                    <template v-if="item.list.length <= item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div
                                class="grade-selects-item"
                                v-for="(item1, index1) in item.list"
                                :key="index1"
                                @click="switchNav2(index, index1)"
                                :class="
                                    item.checkName == item1.title
                                        ? 'grade-selects-item1'
                                        : 'grade-selects-item'
                                "
                            >
                                {{ item1.title }}
                            </div>
                        </div>
                    </template>
                    <template v-if="item.list.length > item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div class="grade-selects-cow">
                                <div style="display: flex;flex-wrap: wrap;">
                                    <div
                                        class="grade-selects-item"
                                        v-for="(item1,
                                        index1) in item.list.slice(
                                            0,
                                            item.showTypeLength
                                        )"
                                        @click="switchNav2(index, index1)"
                                        :key="index1"
                                        :class="
                                            item.checkName == item1.title
                                                ? 'grade-selects-item1'
                                                : 'grade-selects-item'
                                        "
                                    >
                                        {{ item1.title }}
                                    </div>
                                </div>
                                <div
                                    class="grade-selects-zk"
                                    @click="isShow(index)"
                                    v-if="item.list.length > item.max"
                                >
                                    {{ item.fold ? "展开" : "收起" }}
                                    <i
                                        class="el-icon-arrow-down"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="item.fold"
                                    ></i>
                                    <i
                                        class="el-icon-arrow-up"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="!item.fold"
                                    ></i>
                                </div>
                            </div>
                        </div>
                    </template>
                </template>
                <template v-else-if="item.name == '时间'">
                    <template v-if="item.list.length <= item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div
                                class="grade-selects-item"
                                v-for="(item1, index1) in item.list"
                                :key="index1"
                                @click="switchNav3(index, index1)"
                                :class="
                                    item.checkName == item1.subject_name
                                        ? 'grade-selects-item1'
                                        : 'grade-selects-item'
                                "
                            >
                                {{ item1.subject_name }}
                            </div>
                        </div>
                    </template>
                    <template v-if="item.list.length > item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div class="grade-selects-cow">
                                <div style="display: flex;flex-wrap: wrap;">
                                    <div
                                        class="grade-selects-item"
                                        v-for="(item1,
                                        index1) in item.list.slice(
                                            0,
                                            item.showTypeLength
                                        )"
                                        @click="switchNav3(index, index1)"
                                        :key="index1"
                                        :class="
                                            item.checkName == item1.subject_name
                                                ? 'grade-selects-item1'
                                                : 'grade-selects-item'
                                        "
                                    >
                                        {{ item1.subject_name }}
                                    </div>
                                </div>
                                <div
                                    class="grade-selects-zk"
                                    @click="isShow(index)"
                                    v-if="item.list.length > item.max"
                                >
                                    {{ item.fold ? "展开" : "收起" }}
                                    <i
                                        class="el-icon-arrow-down"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="item.fold"
                                    ></i>
                                    <i
                                        class="el-icon-arrow-up"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="!item.fold"
                                    ></i>
                                </div>
                            </div>
                        </div>
                    </template>
                </template>
                <template v-else-if="item.name == '错题'">
                    <template v-if="item.list.length <= item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div
                                class="grade-selects-item"
                                v-for="(item1, index1) in item.list"
                                :key="index1"
                                @click="switchNav4(index, index1)"
                                :class="
                                    item.checkName == item1.subject_name
                                        ? 'grade-selects-item1'
                                        : 'grade-selects-item'
                                "
                            >
                                {{ item1.subject_name }}
                            </div>
                        </div>
                    </template>
                    <template v-if="item.list.length > item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div class="grade-selects-cow">
                                <div style="display: flex;flex-wrap: wrap;">
                                    <div
                                        class="grade-selects-item"
                                        v-for="(item1,
                                        index1) in item.list.slice(
                                            0,
                                            item.showTypeLength
                                        )"
                                        @click="switchNav4(index, index1)"
                                        :key="index1"
                                        :class="
                                            item.checkName == item1.subject_name
                                                ? 'grade-selects-item1'
                                                : 'grade-selects-item'
                                        "
                                    >
                                        {{ item1.subject_name }}
                                    </div>
                                </div>
                                <div
                                    class="grade-selects-zk"
                                    @click="isShow(index)"
                                    v-if="item.list.length > item.max"
                                >
                                    {{ item.fold ? "展开" : "收起" }}
                                    <i
                                        class="el-icon-arrow-down"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="item.fold"
                                    ></i>
                                    <i
                                        class="el-icon-arrow-up"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="!item.fold"
                                    ></i>
                                </div>
                            </div>
                        </div>
                    </template>
                </template>
                <template v-else-if="item.name == '章节'">
                    <template v-if="item.list.length <= item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div
                                class="grade-selects-item"
                                v-for="(item1, index1) in item.list"
                                :key="index1"
                                @click="switchNav5(index, index1)"
                                :class="
                                    item.checkName == item1.subject_name
                                        ? 'grade-selects-item1'
                                        : 'grade-selects-item'
                                "
                            >
                                {{ item1.subject_name }}
                            </div>
                        </div>
                    </template>
                    <template v-if="item.list.length > item.max">
                        <div class="grade-title">{{ item.name }}：</div>
                        <div class="grade-selects">
                            <div class="grade-selects-cow">
                                <div style="display: flex;flex-wrap: wrap;">
                                    <div
                                        class="grade-selects-item"
                                        v-for="(item1,
                                        index1) in item.list.slice(
                                            0,
                                            item.showTypeLength
                                        )"
                                        @click="switchNav5(index, index1)"
                                        :key="index1"
                                        :class="
                                            item.checkName == item1.subject_name
                                                ? 'grade-selects-item1'
                                                : 'grade-selects-item'
                                        "
                                    >
                                        {{ item1.subject_name }}
                                    </div>
                                </div>
                                <div
                                    class="grade-selects-zk"
                                    @click="isShow(index)"
                                    v-if="item.list.length > item.max"
                                >
                                    {{ item.fold ? "展开" : "收起" }}
                                    <i
                                        class="el-icon-arrow-down"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="item.fold"
                                    ></i>
                                    <i
                                        class="el-icon-arrow-up"
                                        style="margin-left: 5px;color: #018854;"
                                        v-if="!item.fold"
                                    ></i>
                                </div>
                            </div>
                        </div>
                    </template>
                </template>
            </div>
        </div>

        <template v-if="datas.length == 0 && sectionList.length == 0">
            <tips :tipsText="'暂无数据'"></tips>
        </template>
        <template v-else>
            <el-card
                class="topic-analysis"
                v-for="(item, index) in datas"
                :key="index"
                shadow="hover"
            >
                <div class="topic-item">
                    <div class="div-flex">
                        <div class="topic-item-title">
                            {{ index + 1 }}、
                            <template>
                                <el-tag
                                    effect="plain"
                                    size="mini"
                                    type="warning"
                                    v-if="item.source_type == 2"
                                    >自评</el-tag
                                >
                                <el-tag
                                    effect="plain"
                                    size="mini"
                                    type="warning"
                                    v-if="item.source_type == 3"
                                    >同步</el-tag
                                >
                                <el-tag
                                    effect="plain"
                                    size="mini"
                                    type="warning"
                                    v-if="item.source_type == 4"
                                    >趣练</el-tag
                                >
                                <el-tag
                                    effect="plain"
                                    size="mini"
                                    type="warning"
                                    v-if="item.source_type == 5"
                                    >智测</el-tag
                                >
                            </template>
                            <el-tag
                                effect="plain"
                                size="mini"
                                style="margin-left:5px"
                                >{{ item.question_type_name }}</el-tag
                            >

                            <div
                                v-html="item.question_title"
                                style="margin-left:10px; word-wrap: break-word;width: 90%;"
                            ></div>
                        </div>
                        <!-- <div class="topic-item-start">
                            <i
                                style="color: rgb(255,165,68);margin-right: 5px;"
                                class="el-icon-star-off"
                            ></i
                            >标记
                        </div> -->
                    </div>
                    <template
                        v-if="
                            (item.question_typeid != 3 &&
                                item.is_one_choice == 2) ||
                                item.is_many_choice == 2
                        "
                    >
                        <div
                            class="analysis_text"
                            v-for="(val, id) in item.answer_list"
                            :key="id"
                        >
                            <div>{{ val.text }}、</div>
                            <div v-html="val.answer"></div>
                        </div>
                    </template>
                    <div
                        class="topic-item-answer"
                        v-if="item.is_sub_question == 1"
                    >
                        <div
                            class="div-flex-false"
                            v-if="item.is_sub_question == 1"
                        >
                            <div>你的答案：</div>
                            <div>
                                <template v-if="item.question_typeid == 11">
                                    <div>
                                        <image
                                            class="yulanImg firstCanvas"
                                            :src="
                                                'data:image/jpeg;base64,' +
                                                    item.myanswer
                                            "
                                            :style="{
                                                background:
                                                    'url(' +
                                                    item.question_photo +
                                                    ') no-repeat'
                                            }"
                                            mode="aspectFit"
                                        ></image>
                                    </div>
                                </template>
                                <template v-else>
                                    <div>
                                        {{
                                            item.myanswer == "" ||
                                            item.myanswer == "undefined"
                                                ? "没答题"
                                                : item.myanswer
                                        }}
                                    </div>
                                </template>
                            </div>
                            <div style="margin-left: 8px;" class="div-flex">
                                <i
                                    v-if="item.is_answer == 2"
                                    class="el-icon-check"
                                    style="color: #18db60;font-size: 22px;margin-left: 3px;"
                                ></i>
                                <i
                                    v-else
                                    class="el-icon-close"
                                    style="color: red;font-size: 22px;margin-left: 3px;"
                                ></i>
                            </div>
                        </div>
                        <div class="div-flex-true">
                            <div>正确答案：</div>
                            <div v-html="item.answer"></div>
                        </div>
                    </div>
                    <div class="topic-item-analysis">
                        <div class="topic-item-label">
                            答案解析：
                        </div>
                        <div
                            class="analysisMore"
                            v-html="item.question_analysis"
                        ></div>
                    </div>
                    <div class="topic-item-analysis" style="margin-top:20px">
                        <div class="topic-item-label">
                            知识点：
                        </div>
                        <div class="analysisMore">
                            章节/知识点：{{ item.gradeName1
                            }}{{ item.subject_name1 }}
                            {{ item.f_section_name1 }}
                            {{ item.section_name1 }}
                        </div>
                    </div>
                    <div class="error">
                        <div>{{ item.update_time }}</div>
                        <div style="margin-left:30px;color:red">
                            错{{ item.errors_num }}次
                        </div>
                        <div
                            style="margin-left:30px;color: #18db60;cursor: pointer;"
                            @click="
                                detail(item.intelligent_id, item.answer_list)
                            "
                        >
                            详细
                        </div>
                    </div>
                </div>
            </el-card>

            <div class="collapse" v-if="switch1 == 1">
                <el-collapse
                    accordion
                    @change="collapseClick"
                    v-model="activeNames"
                >
                    <el-collapse-item
                        :name="index"
                        v-for="(item, index) in sectionList"
                        :key="index"
                    >
                        <template slot="title">
                            <div class="layui-colla-title">
                                <div class="layui-colla-title-left">
                                    {{ item.section_name }}
                                </div>
                                <!-- <div class="layui-colla-title-right">
                                共{{ secondSectionList.length }}个试题
                            </div> -->
                            </div>
                        </template>
                        <template>
                            <template v-if="zid_list.length == 0">
                                <div class="zidNoData">
                                    暂无错题
                                </div>
                            </template>
                            <template v-esle>
                                <div
                                    class="layui-show-item"
                                    v-for="(item1, index1) in zid_list"
                                    :key="index1"
                                    @click="
                                        toChapter(
                                            item1.section_name,
                                            item1.zid,
                                            item.section_name,
                                            item1.errors_num,
                                            item1.total
                                        )
                                    "
                                >
                                    <div class="layui-show-item-left">
                                        <div class="layui-show-item-left-text">
                                            {{ item1.section_name }}
                                        </div>
                                        <div class="layui-show-item-right">
                                            <template
                                                v-if="item1.errors_num >= 10"
                                            >
                                                <div
                                                    style="margin-right:20px;color: #FF7171;"
                                                >
                                                    错{{ item1.errors_num }}次
                                                </div>
                                            </template>
                                            <template
                                                v-if="item1.errors_num < 10"
                                            >
                                                <div
                                                    style="margin-right:20px;color: #00D5A2;"
                                                >
                                                    错{{ item1.errors_num }}次
                                                </div>
                                            </template>

                                            <div style=" color: #999999;">
                                                共{{ item1.total }}题
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </template>
                        </template>
                    </el-collapse-item>
                </el-collapse>
            </div>
        </template>
        <div
            class="pagination"
            v-if="sectionList.length > pagesize1 && switch1 == 1"
        >
            <el-pagination
                @current-change="handleCurrentChange2"
                background
                :page-size="pagesize1"
                layout="total, prev, pager, next, jumper"
                :total="totals"
                :hide-on-single-page="true"
            >
            </el-pagination>
        </div>
        <div class="pagination" v-if="datas.length > pagesize && switch1 != 1">
            <el-pagination
                @current-change="handleCurrentChange1"
                :current-page="page"
                background
                :page-size="pagesize"
                layout="total, prev, pager, next, jumper"
                :total="total"
                :hide-on-single-page="true"
            >
            </el-pagination>
        </div>
        <el-dialog title="错题详细" :visible.sync="dialogTableVisible">
            <el-table :data="recodeList">
                <el-table-column
                    property="time"
                    label="时间"
                    align="center"
                ></el-table-column>
                <el-table-column label="你的答案" align="center">
                    <template slot-scope="scope">
                        <div
                            v-if="
                                scope.row.question_answer_id &&
                                    scope.row.question_answer_id != '0' &&
                                    scope.row.question_answer_id != 'undefined'
                            "
                        >
                            <div v-if="scope.row.question_typeid >= 3">
                                <div v-if="scope.row.user_text_answer">
                                    <div
                                        v-for="(item2, index2) in scope.row
                                            .user_text_answer"
                                        :key="index2"
                                    >
                                        {{ item2 }}
                                    </div>
                                </div>
                            </div>
                            <!-- 对答案进行转换abcd -->
                            <div v-else>
                                <div
                                    v-for="(item2, index2) in scope.row
                                        .question_answer_id"
                                    :key="index2"
                                >
                                    <div
                                        v-for="(item3, index3) in answer_list"
                                        :key="index3"
                                    >
                                        <div
                                            v-if="
                                                item2 ==
                                                    item3.question_answer_id
                                            "
                                        >
                                            {{ item3.text }}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div v-else>
                            没答题
                        </div>
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>
    </div>
</template>

<script>
import util from "@/utils/utilsTools";
import { questionTypeList } from "@/api/testQuestions/type";
import { getSectionLists, getSectionDetail } from "@/api/testQuestions/section";
import { getSubject } from "@/api/testQuestions/subject";
import {
    intelligentLists,
    IntelligentListsDetail,
    ScreenListsByzid
} from "@/api/wisdomBook/index";
import { getQuestionList } from "@/api/testQuestions/question";
import { latex_reques, latex_answer, getAnalysis } from "@/utils/latex";
import { getBriefTime } from "@/utils/timeUtils";
import tips from "@/components/tips/index";
export default {
    components: {
        tips
    },
    props: {},
    data() {
        return {
            grade_list: util.getStage(999),
            class_index: 0, // 选择年级的索引值
            grade: null, // 存储选择后的年级ID，以便传递参数
            typeList: [], //题型列表
            subList: [],
            navData: [],
            loading: null,
            fromList: [
                {
                    source_type: "",
                    title: "全部"
                },
                {
                    source_type: 3,
                    title: "同步"
                },
                {
                    source_type: 4,
                    title: "趣练"
                },
                {
                    source_type: 2,
                    title: "自评"
                },
                {
                    source_type: 5,
                    title: "智测"
                }
            ],
            datas: [], //数据列表
            switch1: 0,
            groupid: "",
            state: 1,
            lists_type: 1, //1普通错题本，2班级错题本
            source_type: "", //选中的来源数值 1为课后作业,2为自评，3为同步，4为趣练，5为智测,6为课前作业，7为随堂练习，8为班级测验
            question_typeid: "", //题型Id
            page: 1,
            pages: 1, //章节列表page
            total: 0,
            recodeList: [], //错题详情
            pagesize: 8,
            pagesize1: 12,
            datas1: [], //答案转换abcd
            dialogTableVisible: false, //错题详细弹窗
            totals: 0, //章节列表total
            answer_list: [],
            sid: "", //选中的科目Id
            textboox: "", //选中的科目教材版本
            zid_list: [],
            loading1: null,
            activeNames: 0, //手风琴默认展开
            sectionList: [] //章节数据
        };
    },
    computed: {},
    watch: {
        subList(newVal) {
            if (newVal) {
                let subjectObj4 = {};
                let subjectObj3 = {};
                let subjectObj2 = {};
                let newList = [{ sid: "", subject_name: "全部" }];
                let subList = newList.concat(this.subList);
                let max = 10;

                if (subList.length > max) {
                    subjectObj2 = {
                        fold: true,
                        index1: 0,
                        showTypeLength: max,
                        max: max,
                        checkName: "全部",
                        name: "时间",
                        list: subList
                    };
                    subjectObj3 = {
                        fold: true,
                        index1: 0,
                        showTypeLength: max,
                        max: max,
                        checkName: "全部",
                        name: "错题",
                        list: subList
                    };
                    subjectObj4 = {
                        fold: true,
                        index1: 0,
                        showTypeLength: max,
                        max: max,
                        checkName: this.subList[0].subject_name,
                        name: "章节",
                        list: this.subList
                    };
                } else {
                    subjectObj2 = {
                        max: max,
                        checkName: "全部",
                        name: "时间",
                        list: subList
                    };
                    subjectObj3 = {
                        max: max,
                        checkName: "全部",
                        name: "错题",
                        list: subList
                    };
                    subjectObj4 = {
                        max: max,
                        checkName: this.subList[0].subject_name,
                        name: "章节",
                        list: this.subList
                    };
                }
                this.navData.push(subjectObj2, subjectObj3, subjectObj4);
                console.log("navData", this.navData);
            }
        }
    },
    beforeCreate() {
        // 生命周期钩子：组件实例刚被创建，组件属性计算之前，如 data 属性等
    },
    created() {
        // 生命周期钩子：组件实例创建完成，属性已绑定，但 DOM 还未生成，el 属性还不存在
        // 初始化渲染页面
        let grade_index = Number(this.$store.getters.userInfo.grade) || null;
        if (grade_index) {
            this.class_index = grade_index - 1;
        }
        // 班级id
        if (this.$route.query.groupid) {
            this.groupid = this.$route.query.groupid;
            this.fromList = [
                {
                    source_type: "",
                    title: "全部"
                },
                {
                    source_type: 6,
                    title: "课前练习"
                },
                {
                    source_type: 7,
                    title: "随堂练习"
                },
                {
                    source_type: 1,
                    title: "课后作业"
                },
                {
                    source_type: 8,
                    title: "班级测验"
                }
            ];
        }

        // 年级

        let subjectObj = {};
        let subjectObj1 = {};

        let max = 10;
        if (this.grade_list.length > max) {
            subjectObj = {
                fold: true,
                index1: 0,
                showTypeLength: max,
                max: max,
                checkName: util.getgradeName(
                    this.$store.getters.userInfo.grade
                ),
                name: "年级",
                list: this.grade_list
            };
        } else {
            subjectObj = {
                max: max,
                checkName: util.getgradeName(
                    this.$store.getters.userInfo.grade
                ),
                name: "年级",
                list: this.grade_list
            };
        }
        this.navData.push(subjectObj);
        // 类型

        if (this.fromList.length > max) {
            subjectObj1 = {
                fold: true,
                index1: 0,
                showTypeLength: max,
                max: max,
                checkName: "全部",
                name: "类型",
                list: this.fromList
            };
        } else {
            subjectObj1 = {
                max: max,
                checkName: "全部",
                name: "类型",
                list: this.fromList
            };
        }
        this.navData.push(subjectObj1);
        this.getSub();
        this.getType();
    },
    beforeMount() {
        // 生命周期钩子：模板编译/挂载之前
    },
    mounted() {
        // 生命周期钩子：模板编译、挂载之后（此时不保证已在 document 中）
    },
    methods: {
        // 展开
        isShow(index) {
            if (this.navData[index].fold) {
                this.navData[index].showTypeLength = this.navData[
                    index
                ].list.length;
            } else {
                console.log(
                    this.navData[index].index1,
                    this.navData[index].max - 1
                );
                if (this.navData[index].index1 > this.navData[index].max - 1) {
                    return;
                }
                this.navData[index].showTypeLength = this.navData[index].max;
            }
            this.navData[index].fold = !this.navData[index].fold;
        },
        //年级
        switchNav(index, index1) {
            this.navData[index].checkName = this.navData[index].list[
                index1
            ].grade_name;
            if (this.navData[index].index1 !== undefined) {
                this.navData[index].index1 = index1;
            }
            this.grade = this.navData[index].list[index1].grade;
            if (this.switch1 == 1) {
                this.getZjList();
            } else {
                this.getlist();
            }
        },
        // 题型
        switchNav1(index, index1) {
            this.navData[index].checkName = this.navData[index].list[
                index1
            ].question_type_name;
            console.log("id", this.navData[index].list[index1]);
            if (this.navData[index].index1 !== undefined) {
                this.navData[index].index1 = index1;
            }
            // 清空除章节的东西
            this.navData.forEach(item => {
                if (item.name == "章节") {
                    item.checkName = item.list[0].subject_name;
                }
            });
            this.itemClick(
                this.navData[index].list[index1].question_type_name,
                this.navData[index].list[index1].question_type_id,
                index1,
                0
            );
        },
        // 类型
        switchNav2(index, index1) {
            this.navData[index].checkName = this.navData[index].list[
                index1
            ].title;
            if (this.navData[index].index1 !== undefined) {
                this.navData[index].index1 = index1;
            }
            // 清空除章节的东西
            this.navData.forEach(item => {
                if (item.name == "章节") {
                    item.checkName = item.list[0].subject_name;
                }
            });
            this.itemClick(
                this.navData[index].list[index1].title,
                this.navData[index].list[index1].source_type,
                index1,
                1
            );
        },
        // 时间
        switchNav3(index, index1) {
            this.navData[index].checkName = this.navData[index].list[
                index1
            ].subject_name;
            if (this.navData[index].index1 !== undefined) {
                this.navData[index].index1 = index1;
            }
            this.switch1 = 0;
            // 清空除章节的东西
            this.navData.forEach(item => {
                if (item.name == "章节") {
                    item.checkName = item.list[0].subject_name;
                } else if (item.name == "错题") {
                    item.checkName = "全部";
                }
            });
            this.itemClick(
                this.navData[index].list[index1].subject_name,
                this.navData[index].list[index1].sid,
                index1,
                3,
                this.navData[index].list[index1].textbook
            );
        },
        // 曾经的错题
        switchNav4(index, index1) {
            this.navData[index].checkName = this.navData[index].list[
                index1
            ].subject_name;
            if (this.navData[index].index1 !== undefined) {
                this.navData[index].index1 = index1;
            }
            this.switch1 = 2;
            // 清空除章节的东西
            this.navData.forEach(item => {
                if (item.name == "章节") {
                    item.checkName = item.list[0].subject_name;
                } else if (item.name == "时间") {
                    item.checkName = "全部";
                }
            });
            if (this.navData[index].list[index1].sid == "") {
                this.state = 1;
            }
            this.itemClick(
                this.navData[index].list[index1].subject_name,
                this.navData[index].list[index1].sid,
                index1,
                3,
                this.navData[index].list[index1].textbook
            );
        },
        // 章节
        switchNav5(index, index1) {
            this.navData[index].checkName = this.navData[index].list[
                index1
            ].subject_name;
            if (this.navData[index].index1 !== undefined) {
                this.navData[index].index1 = index1;
            }
            this.switch1 = 1;

            // 清空除年级之外的东西
            this.navData.forEach(item => {
                if (item.name == "类型") {
                    item.checkName = "全部";
                } else if (item.name == "题型") {
                    item.checkName = "全部";
                } else if (item.name == "时间") {
                    item.checkName = "全部";
                } else if (item.name == "错题") {
                    item.checkName = "全部";
                }
            });

            this.itemClick(
                this.navData[index].list[index1].subject_name,
                this.navData[index].list[index1].sid,
                index1,
                3,
                this.navData[index].list[index1].textbook
            );
        },

        // 题型
        getType() {
            questionTypeList({}).then(res => {
                if (res.code == 200) {
                    this.typeList = res.data;
                    var subjectObj = {};
                    var max = 10;
                    if (this.typeList.length > max) {
                        subjectObj = {
                            fold: true,
                            index1: 0,
                            showTypeLength: max,
                            max: max,
                            checkName: "全部",
                            name: "题型",
                            list: this.typeList
                        };
                    } else {
                        subjectObj = {
                            max: max,
                            checkName: "全部",
                            name: "题型",
                            list: this.typeList
                        };
                    }
                    if (subjectObj.list) {
                        subjectObj.list.unshift({
                            question_type_id: "",
                            question_type_name: "全部"
                        });
                    }
                    this.navData.push(subjectObj);
                }
            });
        },
        getSub() {
            getSubject({}).then(res => {
                if (res.code == 200) {
                    var data = res.data;
                    var length = data.length;

                    for (var i = 0; i < length; i++) {
                        data[i]["subject_name"] = data[i][
                            "subject_name"
                        ].replace(/\s+/g, "");
                    }
                    if (this.subList.length == 0) {
                        this.subList = data;
                    }
                    this.itemClick("全部", "", 0, 3, "");
                }
            });
        },
        itemClick(name, id, index, navIndex, textboox) {
            if (navIndex == 0) {
                this.page = 1;
                this.question_typeid = id;
                this.sectionList = [];
                if (this.switch1 == 1) {
                    this.switch1 = 0;
                    this.getSub();
                }
                this.getlist();
            } else if (navIndex == 1) {
                this.page = 1;
                this.source_type = id;
                this.sectionList = [];
                if (this.switch1 == 1) {
                    this.switch1 = 0;
                    this.getSub();
                }
                this.getlist();
            } else if (navIndex == 2) {
                this.switch1 = index;
                this.datas = [];
                this.sectionList = [];
                this.getSub();
            } else if (navIndex == 3) {
                console.log("switch1", this.switch1);
                if (this.switch1 == 0) {
                    // 点击【按时间】会走进来
                    this.page = 1;
                    this.sid = id;
                    this.state = 1;
                    this.sectionList = [];
                    this.getlist();
                } else if (this.switch1 == 1) {
                    // 点击【按章节】会走进来
                    this.pages = 1;
                    this.activeNames = "";
                    this.sid = id;
                    this.textboox = textboox;
                    this.datas = [];
                    this.getZjList();
                } else if (this.switch1 == 2) {
                    // 点击【曾经的错题】会走进来
                    this.page = 1;
                    this.sid = id;
                    if (id) {
                        this.state = 3;
                    } else {
                        this.state = 1;
                    }
                    this.sectionList = [];
                    this.getlist();
                }
            }
        },
        getlist: function() {
            // 底部加载时，应当把点击班级的状态为false，避免底部加载没有数据的时候会弹出【暂无数据】
            var data = {
                page: this.page,
                pagesize: this.pagesize,
                lists_type: this.lists_type,
                state: this.state,
                grade: this.$store.getters.userInfo.grade
            };

            if (this.groupid != "") {
                data.lists_type = 2;
                data.groupid = this.groupid;
            }

            if (this.source_type != "") {
                data.source_type = this.source_type;
            }

            // 只要有this.grade，就说明选择了年级，因此要将默认的年级给替换了，底部加载时年级的参数就会进行替换掉
            if (this.grade) {
                data.grade = this.grade;
            }

            if (this.question_typeid != "") {
                data.question_typeid = this.question_typeid;
            }

            if (this.sid != "") {
                data.subjectid = this.sid;
            }
            console.log("参数1>>>>>>>>>>>>", data);
            intelligentLists(data).then(res => {
                console.log("res1", res);
                if (res.code == 200 && res.data.data.length > 0) {
                    this.total = res.data.total;
                    console.log("total", this.total);
                    var data = res.data.data;
                    var question_ids_string = res.data.question_ids_string;
                    this.loaddata(data, question_ids_string);
                } else {
                    this.datas = [];
                }
            });
        },
        loaddata(list, question_ids_string) {
            this.loading = this.$loading({
                lock: true,
                text: "加载中",
                spinner: "el-icon-loading",
                background: "rgba(255, 255, 255, 0.5)"
            });
            getQuestionList({
                question_id: question_ids_string,
                is_get_answer: 2,
                is_out_html: 1
            }).then(async res => {
                console.log("res2", res);
                if (res.code == 200) {
                    var dataList = res.data.data;
                    for (var i = 0; i < dataList.length; i++) {
                        if (!dataList[i].answer_list) {
                            dataList[i].answer_list = [];
                        }
                    }
                    latex_reques(dataList, "question_title"); //解析 试题标题 latex 公式转换
                    latex_reques(dataList, "question_analysis"); //解析 试题解析 latex 公式转换
                    latex_answer(dataList, "answer_list"); //解析答案选项 latex 公式转换
                    for (let i = 0; i < dataList.length; i++) {
                        if (
                            dataList[i].is_sub_question == 2 &&
                            !dataList[i].answer_list
                        ) {
                            dataList[i].answer_list = [];
                        }
                        var arr = [];
                        for (let j = 0; j < list.length; j++) {
                            if (
                                dataList[i].question_id == list[j].question_id
                            ) {
                                var obj = {};
                                dataList[i].is_favorite = list[j].is_favorite;
                                obj.user_text_answer = list[j].user_text_answer;
                                obj.question_answer_id =
                                    list[j].question_answer_id;
                                arr.push(obj);
                            }
                        }
                        dataList[i].interest_lists_log = arr;
                    }

                    var da = getAnalysis(dataList);
                    this.datas = da;
                    for (let i = 0; i < this.datas.length; i++) {
                        for (let j = 0; j < list.length; j++) {
                            if (
                                this.datas[i].question_id == list[j].question_id
                            ) {
                                this.datas[i].source_type = list[j].source_type;
                                var time = list[j].update_time;
                                this.datas[i].update_time = getBriefTime(time);
                                this.datas[i].errors_num = list[j].errors_num;
                                this.datas[i].intelligent_id =
                                    list[j].intelligent_id;
                            }
                        }
                        await getSectionDetail({
                            zid: this.datas[i].zid
                        }).then(res => {
                            if (res.code == 200) {
                                var list = res.data[0];
                                this.datas[i].gradeName1 = util.getgradeName(
                                    list.grade
                                );
                                this.datas[i].subject_name1 = list.subject_name;
                                this.datas[i].f_section_name1 =
                                    list.f_section_name;
                                this.datas[i].section_name1 = list.section_name;
                            }
                        });
                    }
                    this.loading.close();
                } else {
                    this.datas = [];
                    this.loading.close();
                }
                this.$forceUpdate();
                console.log("数据2", this.datas);
            });
        },
        getZjList() {
            var userInfo = this.$store.getters.userInfo;
            var data = {
                education: userInfo.education,
                grade: userInfo.grade,
                type: 1,
                sid: this.sid,
                textbook: this.textboox,
                page: this.pages,
                pagesize: this.pagesize1
            };
            // 如果有选择年级，那么就把之前默认的班级参数给重新赋值新的来作为参数
            if (this.grade) {
                data.grade = this.grade;
            }
            getSectionLists(data).then(res => {
                console.log("res", res);
                if (res.code == 200 && res.data.data.length > 0) {
                    this.totals = res.data.total;
                    var list = res.data.data;
                    for (let i = 0; i < list.length; i++) {
                        list[i].is_show = false;
                    }
                    this.sectionList = list;
                } else {
                    this.sectionList = [];
                }
                console.log("sectionList", this.sectionList);
                this.$forceUpdate();
            });
        },

        handleCurrentChange1(currentPage) {
            this.page = currentPage;
            this.getlist();
        },
        handleCurrentChange2(currentPage) {
            this.activeNames = "";
            this.pages = currentPage;
            this.getZjList();
        },
        detail(intelligent_id, answer_list) {
            this.answer_list = answer_list;
            var data = {
                intelligent_id: intelligent_id
            };
            IntelligentListsDetail(data).then(res => {
                if (res.code == 200) {
                    this.recodeList = res.data.data;
                    // var lists = this.recodeList;
                    // this.length = this.recodeList.length;
                    // this.bottomName = '答错'+this.length+'次'
                    // TODO: 以下暂时不需要，会显示不出答案
                    // for(var i = 0; i < lists.length; i++) {
                    // 	// lists[i].answer_list = this.data[0].answer_list;
                    // 	var arr=[];
                    // 	var obj={};
                    // 	obj.user_text_answer = lists[i].user_text_answer;
                    // 	obj.question_answer_id = lists[i].question_answer_id;
                    // 	arr.push(obj);
                    // 	lists[i].interest_lists_log=arr;
                    // }
                    // this.recodeList = util.getAnalysis(lists);
                    for (var j = 0; j < this.recodeList.length; j++) {
                        this.recodeList[j].time = getBriefTime(
                            this.recodeList[j].creat_time
                        );
                    }
                    this.dialogTableVisible = true;
                    console.log("this.recodeList", this.recodeList);
                }
            });
        },
        getfzid(zid) {
            this.loading1 = this.$loading({
                lock: true,
                text: "加载中",
                spinner: "el-icon-loading",
                background: "rgba(255, 255, 255, 0.5)"
            });
            var userInfo = this.$store.getters.userInfo;
            var data = {
                education: userInfo.education,
                grade: userInfo.grade,
                type: 2,
                sid: this.sid,
                textbook: this.textboox,
                page: 1,
                pagesize: 99,
                fid: zid
            };
            // 如果有选择年级，那么就把之前默认的班级参数给重新赋值新的来作为参数
            if (this.grade) {
                data.grade = this.grade;
            }
            getSectionLists(data).then(res => {
                if (res.code == 200) {
                    var listAll = res.data.data;
                    var arr = [];
                    for (var i = 0; i < listAll.length; i++) {
                        arr.push(listAll[i].zid);
                    }
                    var arr1 = arr.join(",");
                    ScreenListsByzid({
                        zid: arr1
                    }).then(async res => {
                        if (res.code == 200) {
                            var data = res.data;
                            var arr1 = [];
                            for (let i = 0; i < data.length; i++) {
                                if (data[i].errors_num > 0) {
                                    for (var j = 0; j < listAll.length; j++) {
                                        if (data[i].zid == listAll[j].zid) {
                                            listAll[j].errors_num =
                                                data[i].errors_num;
                                            arr1.push(listAll[j]);
                                        }
                                    }
                                }
                            }
                            // _this.fList = arr1;
                            var arr2 = [];
                            for (var i = 0; i < arr1.length; i++) {
                                var vData = {
                                    page: 1,
                                    pagesize: 1,
                                    zid: arr1[i].zid
                                };
                                let fList_ary = arr1[i];

                                await getQuestionList(vData).then(res => {
                                    if (res.code == 200) {
                                        fList_ary["total"] = res.data.total;
                                        arr2.push(fList_ary);
                                    }
                                });
                            }
                            this.zid_list = arr2;
                        } else {
                            this.zid_list = [];
                        }
                        console.log("this.zid_list", this.zid_list);
                        this.$forceUpdate();
                        this.loading1.close();
                    });
                }
            });
        },
        collapseClick(index) {
            if (index !== "") {
                this.getfzid(this.sectionList[index].zid);
            }
        },
        toChapter(name, zid, fname, errors_num, total) {
            this.$router.push({
                path: "/wisdomBook/chapter/index",
                query: {
                    name: name,
                    zid: zid,
                    fname: fname,
                    errors_num: errors_num,
                    total: total,
                    groupid: this.groupid
                }
            });
        }
    }
};
</script>

<style lang="scss" scoped>
.mainBox {
    width: 100%;
    padding: 26px;
    box-sizing: border-box;
    .title {
        font-size: 20px;
        color: #2d3440;
    }
}
.nav-select {
    background: #fff;
    border-radius: 8px;
    padding: 24px 48px;
    box-sizing: border-box;
    margin-top: 24px;
    .grade {
        display: flex;
        margin-top: 20px;
        width: 100%;
    }
    .grade:first-child {
        margin-top: 0px;
    }
}
.grade {
    .grade-title {
        margin-right: 20px;
        padding: 4px 8px;
        box-sizing: border-box;
        width: 62px;
        margin: 5px 0px;
    }
    .grade-selects {
        display: flex;
        width: 100%;
        .grade-selects-cow {
            display: flex;
            align-items: center;
            justify-content: space-between;
            width: 100%;
        }
    }
    .grade-selects-item {
        display: flex;
        padding: 4px 7px;
        box-sizing: border-box;
        margin: 5px 12px;
        color: #6d7785;
        cursor: pointer;
    }
    .grade-selects-item1 {
        display: flex;
        padding: 4px 7px;
        box-sizing: border-box;
        border-radius: 20px;
        color: #fff;
        background: #018854;
        margin: 5px 12px;
    }
    .grade-selects-zk {
        min-width: 50px;
        color: #018854;
        display: flex;
        align-items: center;
        cursor: pointer;
    }
}
/* 错题 */
.topic {
    margin-bottom: 24px;
    .topic-item {
        background: #fff;
        border-radius: 8px;
        padding: 16px;
        box-sizing: border-box;
    }
}
.topic-item {
    .topic-item-title {
        font-size: 16px;
        color: #707070;
        word-wrap: break-word;
        width: 100%;
        display: flex;
    }
    .topic-item-answer {
        margin: 10px 0px;
    }
    .div-flex-false {
        display: flex;
        align-items: center;
        color: #707070;
        font-size: 14px;
    }
    .div-flex-true {
        display: flex;
        align-items: center;
        margin-top: 10px;
        font-size: 14px;
        color: #18db60;
    }
    .topic-item-analysis {
        width: 45%;
    }
    .topic-item-label {
        color: black;
        font-weight: 550;
        margin-bottom: 8px;
    }
}
.div-flex {
    display: flex;
    align-items: center;
    .topic-item-mark {
        font-size: 16px;
        color: #707070;
    }
    .topic-item-start {
        font-size: 14px;
        color: #9ea4b0;
        width: 66px;
        height: 20px;
        line-height: 20px;
        background: #ffffff;
        text-align: center;
        border: 1px solid #9ea4b0;
        box-sizing: border-box;
        cursor: pointer;
        border-radius: 3px;
    }
}
.analysis_text {
    font-size: 14px;
    margin-top: 10px;
    color: #707070;
    display: flex;
}
.checkSub {
    width: 100%;
    text-align: right;
    font-size: 18px;
    color: #18db60;
}
// 填空题类型
.resultListType {
    font-size: 18px;
    margin-top: 20px;
    margin-bottom: 10px;
    color: #999999;
}
.pagination {
    padding: 20px 0px;
    .el-pagination {
        text-align: center;
    }
}
.error {
    margin-top: 20px;
    display: flex;
    align-items: center;
}

.collapse {
    flex-grow: 1;
    margin-top: 30px;
    .layui-colla-title {
        display: flex;
        justify-content: space-between;
        color: #2d3440;
        font-weight: 500;
        width: 100%;
        padding: 0px 15px 0px 20px;
    }
    .layui-colla-title-left {
        font-size: 16px;
    }
    .layui-show {
        background: #fff;
        padding: 0px;
    }
    .loadmore {
        padding: 18px 0;
        margin: 0 auto;
        width: 96%;
        text-align: center;
        font-size: 16px;
    }
    .layui-show-item {
        padding: 18px 0px;
        width: 96%;
        margin: 0 auto;
        box-sizing: border-box;
        border-bottom: 1px solid #dadfe6;
        display: flex;
        justify-content: space-between;
        &:last-child {
            border: none;
        }
        .layui-show-item-left {
            display: flex;
            align-items: center;
            width: 98%;
            margin-left: 10px;
            justify-content: space-between;
            .layui-show-item-left-button {
                padding: 3px 8px;
                border-radius: 15px;
                color: white;
                background: #018854;
                margin-left: 20px;
                cursor: pointer;
            }
            .layui-show-item-left-button1 {
                padding: 3px 8px;
                border-radius: 15px;
                color: white;
                background: #ff7171;
                margin-left: 20px;
                cursor: pointer;
            }
        }
        .layui-show-item-right {
            display: flex;
            align-items: center;
        }
    }
}
.zidNoData {
    margin: 20px 24px;
}
</style>
